<script setup lang="ts" name="Header">
import { ref } from 'vue'

let catalogues = ref([
  {
    id: 1,
    name: '番剧',
  },
  {
    id: 2,
    name: '直播',
  },
  {
    id: 3,
    name: '游戏中心',
  },
  {
    id: 4,
    name: '会员购',
  },
  {
    id: 5,
    name: '漫画',
  },
])
</script>

<template>
  <div class="header">
    <ul>
      <li v-for="item in catalogues" :key="item.id">{{ item.name }}</li>
    </ul>
  </div>
</template>

<style scoped>
.header {
  width: 100%;
  background-color: #dadaee;
  position: fixed;
}
</style>
